<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>{% block title %}网站管理后台{% endblock %}</title>
    <!-- 使用本地Bootstrap和Font Awesome -->
    <link href="{{ url_for('static', filename='css/bootstrap/bootstrap.min.css') }}" rel="stylesheet">
    <link href="{{ url_for('static', filename='css/bootstrap/all.min.css') }}" rel="stylesheet">
    <style>
        .sidebar {
            position: fixed;
            top: 56px;
            bottom: 0;
            left: 0;
            z-index: 100;
            padding: 0;
            box-shadow: inset -1px 0 0 rgba(0, 0, 0, .1);
        }
        .sidebar-sticky {
            position: relative;
            top: 0;
            height: calc(100vh - 56px);
            padding-top: .5rem;
            overflow-x: hidden;
            overflow-y: auto;
        }
        .sidebar .nav-link {
            font-weight: 500;
            color: #333;
        }
        .sidebar .nav-link.active {
            color: #007bff;
        }
        main {
            padding-top: 70px; /* 增加顶部padding以避免被导航栏遮挡 */
        }
    </style>
    {% block head %}{% endblock %}
</head>
<body>
    <div class="container-fluid">
        <!-- 导航栏 -->
        <nav class="navbar navbar-expand-lg navbar-dark bg-dark fixed-top">
            <div class="container-fluid">
                <a class="navbar-brand" href="{{ url_for('web.index') }}">管理后台</a>
                {% if session.user_id %}
                <div class="navbar-nav ms-auto">
                    <span class="navbar-text me-3">
                        欢迎, {{ session.username }}
                    </span>
                    <a class="nav-link" href="{{ url_for('web.logout') }}">退出</a>
                </div>
                {% endif %}
            </div>
        </nav>

        <div class="row">
            {% if session.user_id %}
            <!-- 侧边栏 -->
            <nav class="col-md-2 d-none d-md-block bg-light sidebar">
                <div class="sidebar-sticky">
                    <ul class="nav flex-column">
                        <li class="nav-item">
                            <a class="nav-link {% if request.endpoint == 'web.index' %}active{% endif %}" href="{{ url_for('web.index') }}">
                                <i class="fas fa-home"></i> 首页
                            </a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link {% if request.endpoint == 'web.users' %}active{% endif %}" href="{{ url_for('web.users') }}">
                                <i class="fas fa-users"></i> 用户管理
                            </a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link {% if request.endpoint == 'web.roles' %}active{% endif %}" href="{{ url_for('web.roles') }}">
                                <i class="fas fa-user-tag"></i> 角色管理
                            </a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link {% if request.endpoint == 'web.permissions' %}active{% endif %}" href="{{ url_for('web.permissions') }}">
                                <i class="fas fa-key"></i> 权限管理
                            </a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link {% if request.endpoint == 'web.menus' %}active{% endif %}" href="{{ url_for('web.menus') }}">
                                <i class="fas fa-bars"></i> 菜单管理
                            </a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link {% if request.endpoint in ['web.operation_logs', 'web.login_logs'] %}active{% endif %}" href="#logMenu" data-bs-toggle="collapse" role="button" aria-expanded="false" aria-controls="logMenu">
                                <i class="fas fa-file-alt"></i> 日志管理
                            </a>
                            <div class="collapse" id="logMenu">
                                <ul class="nav flex-column ms-3">
                                    <li class="nav-item">
                                        <a class="nav-link {% if request.endpoint == 'web.operation_logs' %}active{% endif %}" href="{{ url_for('web.operation_logs') }}">
                                            <i class="fas fa-cog"></i> 操作日志
                                        </a>
                                    </li>
                                    <li class="nav-item">
                                        <a class="nav-link {% if request.endpoint == 'web.login_logs' %}active{% endif %}" href="{{ url_for('web.login_logs') }}">
                                            <i class="fas fa-sign-in-alt"></i> 登录日志
                                        </a>
                                    </li>
                                </ul>
                            </div>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link {% if request.endpoint in ['web.system_configs', 'web.data_dictionaries'] %}active{% endif %}" href="#systemMenu" data-bs-toggle="collapse" role="button" aria-expanded="false" aria-controls="systemMenu">
                                <i class="fas fa-cogs"></i> 系统管理
                            </a>
                            <div class="collapse" id="systemMenu">
                                <ul class="nav flex-column ms-3">
                                    <li class="nav-item">
                                        <a class="nav-link {% if request.endpoint == 'web.system_configs' %}active{% endif %}" href="{{ url_for('web.system_configs') }}">
                                            <i class="fas fa-wrench"></i> 系统配置
                                        </a>
                                    </li>
                                    <li class="nav-item">
                                        <a class="nav-link {% if request.endpoint == 'web.data_dictionaries' %}active{% endif %}" href="{{ url_for('web.data_dictionaries') }}">
                                            <i class="fas fa-book"></i> 数据字典
                                        </a>
                                    </li>
                                </ul>
                            </div>
                        </li>
                    </ul>
                </div>
            </nav>
            {% endif %}

            <!-- 主内容区 -->
            <main class="col-md-9 ms-sm-auto col-lg-10 px-md-4">
                {% with messages = get_flashed_messages() %}
                    {% if messages %}
                        {% for message in messages %}
                        <div class="alert alert-info alert-dismissible fade show mt-3" role="alert">
                            {{ message }}
                            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
                        </div>
                        {% endfor %}
                    {% endif %}
                {% endwith %}

                {% block content %}{% endblock %}
            </main>
        </div>
    </div>

    <!-- 使用本地Bootstrap和jQuery -->
    <script src="{{ url_for('static', filename='js/bootstrap/jquery.min.js') }}"></script>
    <script src="{{ url_for('static', filename='js/bootstrap/bootstrap.bundle.min.js') }}"></script>
    {% block scripts %}{% endblock %}
</body>
</html>